<template>
  <div class="returns-edit">
    <el-row :gutter="0" justify="end">
      <el-col :span="1"><el-button type="primary">保存</el-button></el-col>
      <el-col :span="1"><el-button @click="handleEdit">返回</el-button></el-col>
    </el-row>
    <el-divider />
    <el-form :inline="true" class="demo-form-inline" :rules="rules">
      <el-form-item label="退货跟单人：" prop="follow">
        <el-input
          placeholder=""
          class="input"
          style="width:300px"
          :value="user"
        >
        </el-input>
      </el-form-item>
      <el-form-item label="退货金额：" prop="amount">
        <el-input
          placeholder=""
          class="input"
          style="width:300px"
          :value="amoutValue"
        >
        </el-input>
      </el-form-item>
      <el-form-item label="仓库名字：" prop="name">
        <el-input placeholder="仓库名字" class="input" style="width: 300px">
        </el-input>
      </el-form-item>
      <el-form-item label="清退地址：" prop="address">
        <el-input placeholder="" class="input" style="width: 300px"> </el-input>
      </el-form-item>
      &emsp;<el-form-item label="供应商：" prop="supplier">
        <el-input
          placeholder=""
          class="input"
          style="width:300px"
        >
          <template #append>
            <el-button :icon="Search" />
          </template>
        </el-input>
      </el-form-item>
      &emsp;<el-form-item label="联系人：" prop="contact">
        <el-input
          placeholder=""
          class="input"
          style="width:300px"
        >
        </el-input>
      </el-form-item>
      <el-form-item label="联系电话：" prop="telphone">
        <el-input placeholder="" class="input" style="width: 300px"> </el-input>
      </el-form-item>
      <el-form-item label="退货地址：" prop="retAddress">
        <el-input placeholder="输入退货地址" class="input" style="width: 300px">
        </el-input>
      </el-form-item>
    </el-form>
    <el-col :span="1"
      ><el-button type="primary">添加产品数据</el-button></el-col
    >
  </div>
  <el-table
    :data="tableData"
    style="width: 100%"
    border
    :header-cell-style="{ background: 'rgb(250,250,250)' }"
  >
    <el-table-column prop="name" label="物资编码" width="200" />

    <el-table-column prop="status" label="物资名字" width="200" />
    <el-table-column prop="receiver" label="物资单价" width="150" />
    <el-table-column prop="supplier" label="退货数量" width="200" />
    <el-table-column prop="cause" label="单位" width="150" />
    <el-table-column prop="time" label="品级" width="150" />
    <el-table-column prop="card" label="品牌" width="200" />
    <el-table-column prop="address" label="产地" width="300" />
    <el-table-column prop="operate" label="操作" width="150" />
    <template #empty>
      <el-empty description="暂无数据" />
    </template>
  </el-table>
  <el-form :inline="true" class="demo-form-inline" :rules="rules">
    <el-form-item label="备注：" prop="remark">
      <el-input placeholder="备注" class="input" style="width: 1200px">
      </el-input>
    </el-form-item>
  </el-form>
</template>

<script setup>
import store from "@/store"
import { ref } from 'vue'
import { Search } from '@element-plus/icons-vue'
import { useRouter } from 'vue-router';

const user = ref('')
user.value = store.getters.Info.name
const amoutValue = ref('')
amoutValue.value = 0

const router = useRouter()
const handleEdit = () => {
  router.push("./list");
};
const rules = {
  follow: [
    {
      required: true,
    },
  ],
  amount: [
    {
      required: true,
    },
  ],
  name: [
    {
      required: true,
    },
  ],
  address: [
    {
      required: true,
    },
  ],
  supplier: [
    {
      required: true,
    },
  ],
  contact: [
    {
      required: true,
    },
  ],
  telphone: [
    {
      required: true,
    },
  ],
  retAddress: [
    {
      required: true,
    },
  ],
  remark: [
    {
      required: true,
    },
  ],
};
</script>

<style lang="less">
.el-table--border,
.el-table--group {
  border: 1px solid rgb(236, 236, 236);
}
</style>
